// 单个选项的高度
const optionh = 30;

/**
 * 在空白处按右键触发的菜单
 * 是一个常驻内存的对象，通过active属性来决定显不显示
 */
class CreateMenu {
    constructor() {
        this.x = 0;
        this.y = 0;
        this.active = false;
        this.options = [
            "对话", "演出",
            "场景", "注释",
            "开始", "结束",
            "自定义"
        ];
        this.width = 100;
        this.height = optionh * this.options.length;
    }

    /**
     * 在坐标(x, y)中出现
     * @param {int} x 
     * @param {int} y 
     */
    show(x, y) {
        this.x = x;
        this.y = y;
        this.active = true;
    }

    unshow() {
        this.active = false;
    }

    createNode(optionIndex) {
        switch(optionIndex) {
            case 0: {
                let node = new DialogNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 1: {
                let node = new PerformNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 2: {
                let node = new SceneNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 3: {
                let node = new CommentsNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 4: {
                // 先判断有没有已经有了开始节点
                for (const node of nodes) {
                    if (node.type == NodeType.Start) {
                        alert("开始节点只能有1个");
                        return;
                    }
                }
                let node = new StartNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 5: {
                for (const node of nodes) {
                    if (node.type == NodeType.End) {
                        alert("结束节点只能有1个");
                        return;
                    }
                }
                let node = new EndNode(this.x, this.y);
                nodes.push(node);
                break;
            }
            case 6: {
                let node = new CustomizeNode(this.x, this.y);
                nodes.push(node);
                break;
            }
        }
    }

    draw() {
        if (this.active == true) {
            // 每个选项就是一个矩形，偏移量就是距离起点的高差
            let offset = 0;
            for (const option of this.options) {
                drawRect(this.x, this.y + offset, this.width, optionh, "#F0F0F0", option, true);
                offset += optionh;
                drawDevider(this.x, this.y + offset, this.width);
            }
        }
    }
}


/**
 * 在节点处右键点出来的菜单
 * 由于编辑菜单有很多种，所以最终决定还是触发了就新建一个对象
 * 这个是默认的编辑菜单
 */
class EditMenu {
    /**
     * 
     * @param {int} x 
     * @param {int} y 
     * @param {Node | Content} parent 
     */
    constructor(x, y, parent) {
        this.x = x;
        this.y = y;
        // 触发者
        this.parent = parent;
        // 选项的名字列表
        this.options = [
            "添加对话", "删除节点"
        ];
        // 选项的回调函数列表
        this.optionCallbacks = [
            function() {   // 添加对话
                // 先获取所需要的DOM元素
                const inputfield = document.getElementById("inputfield");
                const speakerInput = document.getElementById("speakerInput");
                const contentInput = document.getElementById("contentInput");
                // 再将对话框都给显示出来
                inputfield.style.display = "block";
                // 将对话框都清空
                speakerInput.value = "";
                contentInput.value = "";
                // 接下来的事交给提交按钮的事件
            },
            function() {    // 删除节点
                for (let i = 0; i < nodes.length; i++) {
                    if (nodes[i].selected) {
                        deleteNode(i);
                        break;  // 退出循环
                    }
                }
            }
        ]
        this.width = 100;
        this.height = optionh * this.options.length;
    }

    /**
     * 处理相应下标的事件
     * @param {int} index 
     */
    handleOption(index) {
        if (this.optionCallbacks[index] != null) {
            // 如果回调函数不为空，则调用
            this.optionCallbacks[index]();
        }
    }

    draw() {
        let offset = 0;
        for (const option of this.options) {            
            drawRect(this.x, this.y + offset, this.width, optionh, "#F0F0F0", option, true);
            offset += optionh;
            drawDevider(this.x, this.y + offset, this.width);
        }
    }
}

class CustomEditMenu extends EditMenu {
    /**
     * 
     * @param {int} x 
     * @param {int} y 
     * @param {Node | Content} parent 
     * @param {{optionStr: string, callback: Function}[]} options 选项列表
     */
    constructor(x, y, parent, options) {
        super(x, y, parent);
        this.options = new Array(options.length);
        this.optionCallbacks = new Array(options.length);
        for (let i = 0; i < options.length; i++) {
            this.options[i] = options[i].optionStr;
            this.optionCallbacks[i] = options[i].callback;
        }
        // 更新一下菜单长度
        this.height = optionh * this.options.length;
    }
}